<div class="box clearfix">
	<div class="contentset center"><div class="inner"><span><?php echo $heading_title; ?></span></div></div>
	<div class="box-content">
		<div class="box-product">
			<?php 
			$counter = 0;
			foreach ($products as $product) { 
				
				if (($counter+4) % 4 == 0) $xclass="alpha";
				elseif (($counter+2) % 4 == 0) $xclass="pairleft";
				elseif (($counter+1) % 4 == 0) $xclass="omega";
				else $xclass="";
			?>
            <div class="grid_box <?php echo $xclass; ?>">
                <div class="inner">
                    <div class="view-parent">
                        <div class="viewport">
                            <a href="<?php echo $product['href']; ?>">
                                <span class="dark-background">
<!--                                    --><?php //echo $product['name']; ?>
<!--                                    --><?php //if ($product['rating']) { ?>
<!--                                    <div class="rating"><img src="catalog/view/theme/sellegance/images/stars---><?php //echo $product['rating']; ?><!--.png" alt="--><?php //echo $product['reviews']; ?><!--" /></div>-->
<!--                                    --><?php //} ?>
                                </span>
                                <?php if ($product['thumb']) { ?>
                                <img class="product-image" src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" />
                                <?php } ?>
                            </a>
                        </div>
                    </div>
                    <div class="cart"><a onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button cart small"><span><?php echo $button_cart; ?></span></a></div>
                </div>
            </div>

			<?php $counter++; } ?>
		</div>
	</div>
</div>

<script type="text/javascript">
    $(document).ready(function() {
        $('.viewport').mouseenter(function(e) {
            $(this).children('a').children('img').animate({ height: '250', left: '-25', top: '-25', width: '250'}, 100);
//            $(this).children('a').children('span').fadeIn(200);
        }).mouseleave(function(e) {
                    $(this).children('a').children('img').animate({ height: '200', left: '0', top: '0', width: '200'}, 100);
//                    $(this).children('a').children('span').fadeOut(200);
                });
    });
</script>
